<template>
  <el-footer height="40px">
    <div class="footer flex-x-between">
      <div class="times">
        <span>{{ date }}</span>
        <span class="ml-15">星期{{ week[today!] }}</span>
        <span class="ml-15">{{ time }}</span>
      </div>
      <div class="title">技术支撑单位：成都赛康</div>
      <div class="weather">多云转晴<span class="ml-10">20~28℃</span></div>
    </div>
  </el-footer>
</template>
<script setup lang="ts">
import { onMounted, ref } from "vue";
import dayjs from "dayjs";
// 获取时间
const week = ref<string[]>(["日", "一", "二", "三", "四", "五", "六"]);
let time = ref<string>();
let date = ref<string>();
let today = ref<string | number>();
let clearTime = ref<NodeJS.Timeout | number>();
const getTime = () => {
  today.value = new Date().getDay();
  time.value = dayjs().format("YYYY/MM/DD");
  date.value = dayjs().format("HH:mm:ss");
  clearTime.value = setTimeout(() => {
    clearTimeout(clearTime.value);
    getTime();
  }, 1e3);
};

onMounted(() => {
  getTime();
});
</script>

<style scoped lang="scss">
@import "./index.scss";
</style>
